<div class="dialog-container mdl-shadow--8dp mdl-layout--fixed-header mobile-dialog check-out-dialog">
    <div class="kmi-header-row">
        <div class="header-title" ng-bind="dialog.plotInfo.workstation_detail[0].plot_no"></div>
        <div class="kmi-side-btn right" ng-click="dialog.back();">
            <img src="image/icons/clear.png"></img>
            <div class="kmi-can-click"></div>
        </div>
    </div>
    <div class="kmi-layout-main-content">
        <div class="kmi-layout-page">
            <div class="kmi-text-fields">
                <label class="label" ng-bind="'mobile01.checkout.op_no' | translate"></label>
                <div class="header-title" ng-bind="dialog.plotInfo.workstation_detail[0].op_no"></div>
            </div>
            <div class="kmi-text-fields">
                <label class="label" ng-bind="'mobile01.checkout.qty' | translate"></label>
                <input type="text" readonly ng-model="dialog.plotInfo.qty" ng-click="dialog.trackOutInputQty($event, dialog.plotInfo.qty);"></input>
            </div>
            <div class="kmi-text-fields">
                <label class="label" ng-bind="'mobile01.checkout.totalLaborHours' | translate"></label>
                <!--<input type="text" readonly ng-model="dialog.labor_hours" ng-click="dialog.trackInputQty($event, 'labor_hours',dialog.labor_hours);"></input>-->
                <div class="header-title" ng-bind="dialog.plotInfo.workstation_detail[0].labor_hours"></div>      
            </div>
            <div class="kmi-text-fields">
                <label class="label" ng-bind="'mobile01.checkout.machineHours' | translate"></label>
                <input type="text" readonly ng-model="dialog.plotInfo.workstation_detail[0].machine_hours" ng-click="dialog.trackInputQty($event, 'machine_hours',dialog.machine_hours);"></input>
            </div>
        </div>
        <div class="kmi-tab-content" style="border-bottom:1px #cecece solid;">
            <div class="tab" ng-click="dialog.changeTab($index)" ng-class="{'is-select':status.select}"
                 ng-repeat="status in dialog.status_list">
                <label ng-bind="status.name"></label>
                <div class="kmi-can-click"></div>
            </div>
        </div>
        <div class="kmi-layout-main-content" >
            <div class="kmi-layout-main-content" ng-show="dialog.status_list[0].select">
                <div class="kmi-list" style="border-top: 1px #cecece solid;">
                    <div class="kmi-list__row-content">
                        <div class="row-content" ng-repeat="item in dialog.bad_type_list track by $index">
                            <div class="kmi-text-fields reason-box">
                                <label class="label" ng-bind="item.reason_sub_type"></label>
                                <button class="mdl-button mdl-js-button mdl-button--icon kmi-button--icon" ng-click="dialog.add(item.reason_type);">
                                    <img src="image/icons/add_48x48.png" style="width:30px; height:30px;"></img>
                                </button>
                            </div>
                            <div class="kmi-text-fields reason-box" ng-repeat="badItem in dialog.badItemList|filter:{reason_type:item.reason_type} track by $index" style="padding-right: 60px;">
                                <div class="kmi-badreason-row-fields">
                                    <div class="column-item left" ng-bind="badItem.abnormal_name"></div>
                                    <div class="column-item right" ng-bind="('mobile01.qty' | translate)+badItem.defect_qty"></div>
                                </div>
                                <div class="row-button">
                                    <button class="mdl-button mdl-js-button mdl-button--icon kmi-button--icon"
                                            ng-click="dialog.remove(badItem);">
                                            <img src="image/icons/delete.png" style="width:30px; height:30px;"></img>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="kmi-layout-main-content" ng-show="dialog.status_list[1].select">
                <div class="kmi-list">
                    <div class="kmi-list__header">
                        <!--<div class="kmi-list__column" style="flex:1;" ng-bind="'mobile01.checkout.multiple.laborNo' | translate"></div>-->
                        <div class="kmi-list__column" style="flex:1;" ng-bind="'mobile01.checkout.multiple.laborName' | translate"></div>
                        <div class="kmi-list__column" style="flex:1;" ng-bind="'mobile01.checkout.multiple.qty' | translate"></div>
                        <div class="kmi-list__column" style="flex:1;" ng-bind="'mobile01.checkout.multiple.labor_time' | translate"></div>
                        <div class="kmi-list__column" style="flex:1;" ng-bind="'mobile01.checkout.multiple.ParameterValue' | translate"></div>
                    </div>
                    <div class="kmi-list__row-content">
                        <div class="kmi-list__row" ng-repeat="labor in dialog.plotInfo.workstation_detail[0].labor_detail track by $index">
                            <!--<div class="kmi-list__column column-border" style="flex:1;" ng-bind="labor.labor_no"></div>-->
                            <div class="kmi-list__column column-border" style="flex:1;" ng-bind="labor.labor_name"></div>
                            <div class="kmi-list__column column-input" style="flex:1;">
                                <input readonly="readonly" ng-model="labor.qty" ng-click="dialog.trackLabor_qty_InputQty($event, labor, labor.qty);">
                            </div>
                            <div class="kmi-list__column column-input" style="flex:1">
                                <input readonly="readonly" ng-model="labor.labor_time" ng-click="dialog.trackLabor_hours_InputQty($event, labor,labor.labor_time);">
                            </div>
                            <div class="kmi-list__column column-border" style="flex:1;" ng-bind="labor.ParameterValue"></div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 生產訊息收集 -->
            <div class="kmi-layout-main-content" ng-show="dialog.status_list[2].select ">
                <div class="kmi-list">
                    <div class="kmi-list__header">
                        <div class="kmi-list__column" style="flex:1;" ng-bind="'mobile01.checkout.info_collect.no' | translate"></div>
                        <div class="kmi-list__column" style="flex:1;" ng-bind="'mobile01.checkout.info_collect.name' | translate"></div>
                        <div class="kmi-list__column" style="flex:1;" ng-bind="'mobile01.checkout.info_collect.description' | translate"></div>
                        <div class="kmi-list__column" style="flex:1;" ng-bind="'mobile01.checkout.info_collect.collection' | translate"></div>
                    </div>
                    <div id="lotInfo" class="kmi-list__row-content">
                        <div class="kmi-list__row" ng-repeat="info in dialog.production_inf_detail track by $index">
                            <div class="kmi-list__column column-border" style="flex:1;" ng-bind="info.productioninf_no"></div>
                            <div class="kmi-list__column column-border" style="flex:1;" ng-bind="info.productioninf_name"></div>
                            <div class="kmi-list__column column-border" style="flex:1;" ng-bind="info.description"></div>
                            <div class="kmi-list__column column-input" style="flex:1">
                                <input ng-if="info.method=='1'" ng-model="info.productioninf_value">
                                <div ng-if="info.method =='2'" class="check-point-switch" ng-class="{'is-selected':info.productioninf_value == '1'}"
                                    ng-click="dialog.switchClick(info);" ng-init='dialog.switchInit(info);'>
                                    <div style="width:24px;height:24px;"></div>
                                </div>
                                <input ng-if="info.method =='3'" mdl-calculater="info.productioninf_value" mdl-calculater-decimal="true">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="kmi-mobile__btn-content">
            <button class="kmi-button__mobile" ng-click="dialog.confirm();">
                <label ng-bind="'common.btn.confirm' | translate"></label>
                <div class="kmi-can-click"></div>
            </button>
        </div>
    </div>
</div>
